<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.book.web.Book" %>
<%@ page import="java.util.List" %>
<!DOCTYPE html >
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="referrer" content="no-referrer" />
    <link rel="stylesheet" href="https://cdn.staticfile.net/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://cdn.staticfile.net/jquery/2.1.1/jquery.min.js"></script>
    <script src="https://cdn.staticfile.net/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <title>Book List</title>
    <style>
        button[name="first"]{
            appearance: none;
            position: absolute;
            background-color: rgba(255, 255, 255, 0);
            border: 0;
            color: rgba(46, 45, 45, 0.91);
            top: 65px;
            left:1140px;
            font-size: 30px;
        }
        button[name="exit"]{
            appearance: none;
            position: absolute;
            background-color: rgba(255, 255, 255, 0);
            border: 0;
            color: rgba(58, 57, 57, 0.91);
            top: 65px;
            left:1260px;
            font-size: 30px;
        }
        button[name="return"]{
            appearance: none;
            position: absolute;
            background-color: rgba(255, 255, 255, 0);
            border: 0;
            color: rgba(58, 57, 57, 0.91);
            top: 65px;
            left:260px;
            font-size: 30px;
        }
        #de{
            position: absolute;
            left:1150px;
            font-size: 20px;
        }
        .pagination{
            position: relative;
            top: 10px;
            left:500px;
            background-color: rgb(251, 249, 242);
            color: rgba(23, 23, 23, 0.91);
        }
        .media {
            margin: 0 auto;
            padding: 0 300px;
        }
        .media-heading {
            text-align: center;
        }
    </style>
</head>
<body>
<p id="f2"></p>
<ol class="breadcrumb">
    <li><a href="user.jsp">返回</a></li>
    <li><a href="1.jsp">首页</a></li>
    <li><a href="a.jsp">退出登录</a></li>
</ol>
<table class="table table-hover" >
    <%
        List<Book> bookList = (List<Book>) request.getAttribute("bookList");
        for (int i = 0; i < bookList.size(); i++) {
            Book book = bookList.get(i);
    %>
    <tr>
        <div class="media">
            <div class="media-left media-middle">
                <a>
                    <img class="media-object" src="<%=book.getPhoto()%>" width="150" height="200"/>
                </a>
            </div>
            <div class="media-body">
                <h4 class="media-heading" center><%=book.getId()%><br><%=book.getName()%>--<%=book.getAuthor()%><br><%=book.getType()%><br><%=book.getContent()%></h4>
                <a href="borrow?id=<%=book.getId()%>" id="de">借阅</a>
            </div>
        </div>
    </tr>
    <%
        }
    %>
</table>
</body>
</html>